let gameFrameSide = document.getElementById('j-game-frame-aside');
let gameFrameServer = document.getElementById('j-game-frame-server');
let gameFrameGames = document.getElementById('j-game-frame-games');

document.getElementById('j-game-frame-control').addEventListener('click', () => {
    gameFrameSide.classList.toggle('hide');
}, false);

document.getElementById('j-game-frame-tab').addEventListener('click', (e) => {
    let tagName = (e.target.tagName || e.target.nodeName).toLowerCase();
    if (tagName === 'li' && !e.target.classList.contains('current')) {
        e.target.classList.add('current');

        if (e.target.dataset.type == 1) {
            gameFrameServer.classList.remove('dn');
            gameFrameGames.classList.add('dn');
            e.target.parentNode.querySelectorAll('li')[1].classList.remove('current');
        } else {
            gameFrameGames.classList.remove('dn');
            gameFrameServer.classList.add('dn');
            e.target.parentNode.querySelectorAll('li')[0].classList.remove('current');
        }
    }
}, false);
